<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <title>用户管理</title>
    <link rel="stylesheet" href="../layui/css/layui.css"/>
    <link rel="stylesheet" href="../font-awesome-4.7.0/css/font-awesome.min.css">
    <script>
        function exportExcel() {
            var userName = layui.$("input[name='searchUsername']").val();
            var a= document.createElement("a");
            a.href="../user/exportExcel?userName="+userName;
            a.style.display="none";
            document.body.appendChild(a);
            a.click();
        }
    </script>
</head>
<body>
    <h2>用户管理</h2>
    <div>
        <div id="topbar">
            <button type="button" onclick="showAddModel()" class="layui-btn layui-btn-normal"><i class="fa fa-plus"></i>添加</button>
            <button type="button" onclick="deleteUser()" class="layui-btn layui-btn-danger"><i class="fa fa-remove"></i>删除</button>
            <button type="button" onclick="editUser()" class="layui-btn layui-btn-normal"><i class="fa fa-edit"></i>修改</button>
            <button type="button" onclick="exportExcel()" class="layui-btn layui-btn-green">导出</button>
            <div class="layui-input-inline">
                <input type="text" name="searchUsername" placeholder="请输入用户名" autocomplete="off" class="layui-input" style="margin-left: 40px;width: 200px; margin-right: 0px">
            </div>
            <button class="layui-btn" onclick="searchUser()"><i class="fa fa-search"></i></button>

        </div>
    </div>
    <div id="addUserModel" style="display: none">
        <form id="addUserForm" class="layui-form layui-form-pane">
            <div class="layui-form-item" pane>
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-block">
                    <input type="text" name="userName" required  lay-verify="checkUserName" placeholder="请输入账号" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item" pane>
                    <label class="layui-form-label">密码</label>
                    <div class="layui-input-block">
                        <input type="password"  name="userPwd" required  lay-verify="checkPassword" placeholder="请输入密码" autocomplete="off" class="layui-input">
                    </div>
            </div>
            <div class="layui-form-item" align="center">
                <button class="layui-btn" lay-submit lay-filter="addUserBtn">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </form>
    </div>
    <div id="editUserModel" style="display: none">
        <form id="editUserForm" class="layui-form layui-form-pane">
            <input type="hidden" name="userId"/>
            <div class="layui-form-item" pane>
                <label class="layui-form-label">用户名</label>
                <div class="layui-input-block">
                    <input type="text" name="userName" required  lay-verify="checkUserName" placeholder="请输入账号" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item" pane>
                <label class="layui-form-label">密码</label>
                <div class="layui-input-block">
                    <input type="password" name="userPwd" required  lay-verify="checkPassword" placeholder="请输入密码" autocomplete="off" class="layui-input">
                </div>
            </div>
            <div class="layui-form-item" align="center">
                <button class="layui-btn" lay-submit lay-filter="updateUserBtn">立即提交</button>
                <button type="reset" class="layui-btn layui-btn-primary">重置</button>
            </div>
        </form>

    </div>
    <div>
        <table id="demo" lay-filter="test"></table>
    </div>


    <script type="text/javascript" src="../layui/layui.all.js"></script>
    <script type="text/javascript" src="../js/userManager.js"></script>
</body>
</html>